// pages/statistics/statistics.js
const app = getApp();
const request = require('../../utils/request.js');
const util = require('../../utils/util.js');
const ApiRootUrl = app.globalData.REQUEST_IP_HEAD;
import * as echarts from '../../lib/ec-canvas/echarts';

/**
 * 传入数据，绘画折线图表
 * @param {*} chart 
 * @param {*} ydata 
 * @param {*} xdata 
 */
function data_bpline(Linechart, ydata,xdata) {
  let option = {
    title: {
      text: '近七天校医室看诊频率',
      left: 'center'
    },
    // legend: {
    //   data: ['A', 'B', 'C'],
    //   top: 50,
    //   left: 'center',
    //   backgroundColor: 'red',
    //   z: 100
    // },
    grid: {
      containLabel: true
    },
    tooltip: {
      show: true,
      trigger: 'axis'
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      data: xdata,
      // show: false
    },
    yAxis: {
      x: 'center',
      type: 'value',
      splitLine: {
        lineStyle: {
          type: 'dashed'
        }
      }
      // show: false
    },
    series: [{
      name: '看诊次数',
      type: 'line',
      smooth: true,
      data: [ydata[0], ydata[1], ydata[2], ydata[3], ydata[4], ydata[5], ydata[6]]
    }
    // , {
    //   name: 'B',
    //   type: 'line',
    //   smooth: true,
    //   data: [12, 50, 51, 35, 70, 30, 20]
    // }, {
    //   name: 'C',
    //   type: 'line',
    //   smooth: true,
    //   data: [10, 30, 31, 50, 40, 20, 10]
    // }
    ]
  };
  Linechart.setOption(option);

  return Linechart;
}

/**
 * 传入数据，绘画柱状图表
 * @param {*} Barchart 
 * @param {*} yAxisData 
 * @param {*} seriesData 
 */
function data_bpbar(Barchart,yAxisData,seriesData) {
  let option = {
    title: {
      text: '近七天高发疾病确诊频率',
      left: 'center'
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {            // 坐标轴指示器，坐标轴触发有效
        type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
      },
      confine: true
    },
    // legend: {
    //   data: ['热度', '正面', '负面']
    // },
    grid: {
      left: 20,
      right: 20,
      bottom: 15,
      top: 40,
      containLabel: true
    },
    xAxis: [
      {
        type: 'value',
        axisLine: {
          lineStyle: {
            color: '#999'
          }
        },
        axisLabel: {
          color: '#666'
        }
      }
    ],
    yAxis: [
      {
        type: 'category',
        axisTick: { show: false },
        data: yAxisData,
        axisLine: {
          lineStyle: {
            color: '#999'
          }
        },
        axisLabel: {
          color: '#666'
        }
      }
    ],
    series: [
      {
        name: '确诊次数',
        type: 'bar',
        label: {
          normal: {
            show: true,
            position: 'inside'
          }
        },
        data: seriesData,
        itemStyle: {
          // emphasis: {
          //   color: '#37a2da'
          // }
        }
      },
      // {
      //   name: '正面',
      //   type: 'bar',
      //   stack: '总量',
      //   label: {
      //     normal: {
      //       show: true
      //     }
      //   },
      //   data: [120, 102, 141, 174, 190, 250, 220],
      //   itemStyle: {
      //     // emphasis: {
      //     //   color: '#32c5e9'
      //     // }
      //   }
      // },
      // {
      //   name: '负面',
      //   type: 'bar',
      //   stack: '总量',
      //   label: {
      //     normal: {
      //       show: true,
      //       position: 'left'
      //     }
      //   },
      //   data: [-20, -32, -21, -34, -90, -130, -110],
      //   itemStyle: {
      //     // emphasis: {
      //     //   color: '#67e0e3'
      //     // }
      //   }
      // }
    ]
  };
  Barchart.setOption(option);

  return Barchart;
}

Page({

  /**
   * 页面的初始数据
   */
  data: {
    ec_line: {},
    ec_bar: {},
    diagnosticFreqY:[5,7,6,12,13,20,10],
    diagnosticFreqX:['6/1','6/2','6/3','6/4','6/5','6/6','6/7'],
    diseaseFreqY:['感冒','口腔溃疡','前列腺炎','创伤性鼻出血','腹泻','头外伤','头晕'],
    seriesData:[5,7,6,12,13,20,10],
  },

  /**
   * 初始化折线图数据图表
   */
  initLine() {
    let Linechart;
    this.randarComponentLine.init((canvas, width, height, dpr) => {
      Linechart = echarts.init(canvas, null, {
        width: width,
        height: height,
        devicePixelRatio: dpr,
      });
      // 这里就是你要传输的数据
      data_bpline(Linechart, this.data.diagnosticFreqY,this.data.diagnosticFreqX);
      this.Linechart = Linechart;
      return Linechart;
    });
  },
    /**
   * 初始化柱状图数据图表
   */
  initBar() {
    let Barchart;
    this.randarComponentBar.init((canvas, width, height, dpr) => {
      Barchart = echarts.init(canvas, null, {
        width: width,
        height: height,
        devicePixelRatio: dpr,
      });
      // 这里就是你要传输的数据
      data_bpbar(Barchart,this.data.diseaseFreqX,this.data.diseaseFreqData);
      this.Barchart = Barchart;
      return Barchart;
    });
  },

  /**
   * 得到看诊频率
   */
  getDiagnosticCount(){
    var that = this;
    request.get('/diagnosis/countDiagnosisFreq', {}).then((res) => {
      if (res.code == 200) {
        var count = res.data;
        var x = [];
        var y = [];
        for(var i=0;i<count.length;i++){
          var time = count[i].time.split("-");
          x[i] = parseInt(time[1])+"/"+parseInt(time[2]);
          y[i] = count[i].data;
        }
        that.setData({
          diagnosticFreqX: x,
          diagnosticFreqY: y
        })
        //这个id要对应在wxml里边图表的容器id
        that.randarComponentLine = that.selectComponent("#mychart-dom-line");
        that.initLine();
      } else {
        util.showToast(res.msg, 'none');
      }
    }).catch((errMsg) => {
      util.showToast(errMsg, 'error');
    })
  },
  /**
   * 得到确诊频率
   */
  getDiseaseCount(){
    var that = this;
    request.get('/diagnosis/countDiseaseFreq', {}).then((res) => {
      if (res.code == 200) {
        var count = res.data;
        var data = [];
        var y = [];
        for(var i=0;i<count.length;i++){
          data[i] = count[i].data;
          y[i] = count[i].title;
        }
        that.setData({
          diseaseFreqData: data,
          diseaseFreqX: y
        })
        that.randarComponentBar = that.selectComponent("#mychart-dom-bar");
        //这个id要对应在wxml里边图表的容器id
        that.initBar();
      } else {
        util.showToast(res.msg, 'none');
      }
    }).catch((errMsg) => {
      util.showToast(errMsg, 'error');
    })
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.getDiagnosticCount();
    this.getDiseaseCount();
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})